<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

<title>浏览拍卖中的物品</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/ssh.css">
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.8.2.js">
	var $ = jQuery;
</script>
<script type="text/javascript">
	$(document).ready(function() {
		find();
		$("#pageSize").bind("keyup", function() {
			find();
		});
		//设置键盘 监听事件 也就是当你在该文本框中输入值后 就立刻执行相对应的方法 这里所表示的是 当你在文本框中输入4 等 就会在页面上显示4条数据 
		$("#pageNo").bind("keyup", function() {
			find();
		});
		//设置键盘 监听事件 也就是当你在该文本框中输入值后 就立刻执行相对应的方法 这里所表示的是 当你在文本框中输入5 等 就会在页面上显示第五条页 
		alert(" find()");

	});
	function find() {

		$.post('item.do?operate=ches', 'pagesize=' + $("#pageSize").val()
				+ '&pageno=' + $("#pageNo").val(), function(data) {//val()获取文本框里的值 
			//function(data) 里面的data 是 action中返回来 （return）的数据 结果 
			$("#kind").text("");//清空tr里面的 td 否则 会打印出很多重复的 数据 
			$.each(data, function(i, n) {
				//alert(n.itemName);
				var mod = $("#tr").clone();//在想把DOM文档中元素的副本添加到其他位置时这个函数非常有用。
				mod.find("#itemname").html(
						"<a href='item.do?operate=wupinxiangxi&itemId="
								+ n.itemId + "'>" + n.itemName + "</a>");
				mod.find("#kindname").text(n.itemName);
				mod.find("#addtime").text(n.addtime);
				mod.find("#maxPrice").text(n.maxPrice);
				mod.find("#username").text(n.itemName);
				mod.find("#itemremark").text(n.itemRemark);
				mod.show();
				$("#kind").append(mod);
			})
		}, 'json')
	}
</script>
<script type="text/javascript">
	var pageTotal = 0;//根据数据库中的数据判断能显示几页
	function page_tptal()//拿到值
	{
		var count = parseInt($("#count").val());//拿到共查询到了几次页面
		var pageNo = parseInt($("#pageNo").val());//拿到当前显示的页数
		var pageSize = parseInt($("#pageSize").val());//拿到当前显示的行数
		alert(count + "   " + pageNo + "    " + pageSize);
		if (count % pageSize != 0) {
			pageTotal = parseInt(count / pageSize) + 1;
		} else if (count % pageSize == 0) {
			pageTotal = count / pageSize;
		}
	}

	function page_first()//第一页
	{
		$("#pageNo").val("1");
		find();
		alert("第一页" + $("#pageNo").val());
		//getItemList();
	}

	function page_pre()//上一页
	{
		var pageNo = parseInt($("#pageNo").val());
		var pag = pageNo - 1;
		alert("上一页" + pag);
		$("#pageNo").val(pag);
		page_validate();
		find();
		//getItemList();
	}
	function page_next()//下一页
	{
		var pageNo = parseInt($("#pageNo").val());
		var pag = pageNo + 1;
		alert("下一页" + pag);
		$("#pageNo").val(pag);
		page_validate();
		find();
		//getItemList();
	}
	function page_last()//最后一页
	{
		page_tptal();
		$("#pageNo").val(pageTotal);
		alert("最后一页" + $("#pageNo").val());
		find();
		//getItemList();
	}
	function page_validate() {
		page_tptal();
		var count = parseInt($("#count").val());//拿到共查询到了几次页面
		var pageNo = parseInt($("#pageNo").val());//拿到当前显示的页数
		var pageSize = parseInt($("#pageSize").val());//拿到当前显示的行数
		if (pageSize < 0) {
			alert("请输入大于0的数字");
			pageSize = 10;
		} else if (pageSize < count) {
			if (pageNo > pageTotal) {
				pageno = pageNo - 1;
				$("#pageNo").val(pageno);
			}
			if (pageNo < 1) {
				pageno = pageNo + 1;
				$("#pageNo").val(pageno);
			}
		} else {
			alert("输入有误");
			$("#pageSize").val(10)
		}
	}

	function tj() {
		find();

	}
</script>
</head>
<body>
	<table width="780" align="center" CELLSPACING=0
		background="images/bodybg.jpg">
		<tr>
			<td><br>
				<table width=80% border=0 align="center" cellpadding=0
					cellspacing="1" bgcolor="#CCCCCC">
					<tr class="pt9" height="30">
						<td bgcolor="#FFFFFF"><b>物品名</b>
						</td>
						<td bgcolor="#FFFFFF"><b>种类</b>
						</td>
						<td bgcolor="#FFFFFF"><b>起拍时间</b>
						</td>
						<td bgcolor="#FFFFFF"><b>最高价格</b>
						</td>
						<td bgcolor="#FFFFFF"><b>所有者</b>
						</td>
						<td bgcolor="#FFFFFF"><b>物品备注</b>
						</td>
					</tr>

					<tr id="tr" style="display:none;">
						<td id="itemname" bgcolor="#FFFFFF"></td>
						<td id="kindname" bgcolor="#FFFFFF"></td>
						<td id="addtime" bgcolor="#FFFFFF"></td>
						<td id="maxPrice" bgcolor="#FFFFFF"></td>
						<td id="username" bgcolor="#FFFFFF"></td>
						<td id="itemremark" bgcolor="#FFFFFF"></td>
					</tr>
					<tr id="kind" class="pt9" height="24">
					</tr>
				</table></TD>
		</TR>
		<tr>
			<td colspan="6"><span id="sun">共${count}条记录</span> <input
				type="hidden" value="${count}" name="count" id="count" /> 每页显示<input
				name="pageSize" value="${pageSize}" size="3" id="pageSize" />条 第<input
				name="pageNo" value="${pageNo}" size="3" id="pageNo" />页 <a
				href="javascript:page_first();">第一页</a> <a
				href="javascript:page_pre();">上一页</a> <a
				href="javascript:page_next();">下一页</a> <a
				href="javascript:page_last();">最后一页</a>
				<button id="go" onclick="tj()">GO</button></td>
		</tr>
	</TABLE>
	< file="footer.jsp"%>
</body>
</html>

